// 1. 导入 VuePress 2.x 核心依赖（基于 Vue3，使用 ESM 语法）
// @vuepress/theme-default@next：VuePress 2.x 官方默认主题（适配 Vue3）
import { defaultTheme } from '@vuepress/theme-default';
// @vuepress/plugin-search@next：Vue3 兼容的搜索插件
import { searchPlugin } from '@vuepress/plugin-search';
// @vuepress/plugin-components@next：Vue3 兼容的组件插件
import { componentsPlugin } from '@vuepress/plugin-components';
// @vuepress/plugin-i18n@next：Vue3 版本的多语言插件（VuePress 2.x 官方新增）
import { i18nPlugin } from '@vuepress/plugin-i18n';

// 2. 导出 VuePress 2.x 配置对象（完全兼容 Vue3）
export default {
  // ========================= 基础配置（Vue3 环境适配） =========================
  // VuePress 2.x 基于 Vue3 + Vite，支持 ESM 和 TypeScript
  lang: 'zh-CN',  // 默认语言（全局 fallback）
  title: '我的个人博客',
  description: '基于 VuePress 2.x（Vue3） + Gin + GORM 开发的多语言博客',
  base: '/',      // 部署基础路径（同之前逻辑）
  port: 8080,     // 开发端口（避开后端 8081）

  // 注入 HTML 头部资源（支持 Vue3 组件所需的外部资源）
  head: [
    ['link', { rel: 'stylesheet', href: '/custom.css' }],  // 自定义样式
    ['link', { 
      rel: 'stylesheet', 
      href: 'https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css' 
    }],
    // 引入 Vue3 全局变量（可选，如需在页面中直接使用 Vue3 API）
    ['script', { src: 'https://unpkg.com/vue@3/dist/vue.global.prod.js' }]
  ],

  // ========================= 多语言配置（VuePress 2.x 官方 i18n 插件） =========================
  plugins: [
    // 多语言核心插件（替代 VuePress 1.x 的 locales 配置方式）
    i18nPlugin({
      locales: {
        '/': {
          lang: 'zh-CN',
          title: '我的个人博客',
          description: '基于 Vue3 技术栈的多语言博客',
        },
        '/en/': {
          lang: 'en-US',
          title: 'My Personal Blog',
          description: 'Multi-language blog based on Vue3',
        },
      },
      // 多语言切换组件的配置
      selectorLabel: '语言 / Language',  // 切换器显示文本
    }),

    // 搜索插件（Vue3 兼容版）
    searchPlugin({
      locales: {
        '/': { placeholder: '搜索文档...' },
        '/en/': { placeholder: 'Search docs...' },
      },
      maxSuggestions: 10,
      // 过滤不需要搜索的页面
      isSearchable: (page) => 
        !page.path.includes('/login/') &&
        !page.path.includes('/register/') &&
        !page.path.includes('/admin/'),
    }),

    // 组件插件（Vue3 兼容版，提供 Button/Icon 等组件）
    componentsPlugin({
      components: ['Button', 'Icon', 'Badge'],  // 新增 Badge 组件（Vue3 版本支持）
      // Vue3 特有的组件配置（按需加载）
      componentOptions: {
        transition: {
          // 配置 Vue3 过渡动画组件
          name: 'fade',
          mode: 'out-in',
        },
      },
    }),
  ],

  // ========================= 主题配置（VuePress 2.x 官方主题，基于 Vue3） =========================
  theme: defaultTheme({
    // 1. 导航栏配置（支持 Vue3 组件语法）
    navbar: [
      { text: '首页', link: '/' },
      {
        text: '文档列表',
        children: [
          { text: '技术笔记', link: '/docs/tech/' },
          { text: '生活随笔', link: '/docs/life/' },
          { text: '其他文档', link: '/docs/other/' },
        ],
      },
      { text: '管理中心', link: '/admin/' },
      { text: '登录', link: '/login/', id: 'login-link' },
      { text: '注册', link: '/register/', id: 'register-link' },
      // 多语言切换（与 i18nPlugin 联动）
      {
        text: '语言',
        children: [
          { text: '中文', link: '/' },
          { text: 'English', link: '/en/' },
        ],
      },
    ],

    // 2. 侧边栏配置（Vue3 版本支持动态加载）
    sidebar: {
      '/docs/tech/': [
        { text: 'Gin 入门', link: '/docs/tech/gin.md' },
        { text: 'VuePress 2.x 配置', link: '/docs/tech/vuepress.md' },  // 适配 2.x 版本
      ],
      '/docs/life/': [
        { text: '旅行记录', link: '/docs/life/travel.md' },
        { text: '读书心得', link: '/docs/life/book.md' },
      ],
      '/en/docs/tech/': [
        { text: 'Gin Intro', link: '/en/docs/tech/gin.md' },
        { text: 'VuePress 2.x Config', link: '/en/docs/tech/vuepress.md' },
      ],
      '/en/docs/life/': [
        { text: 'Travel Log', link: '/en/docs/life/travel.md' },
        { text: 'Reading Notes', link: '/en/docs/life/book.md' },
      ],
    },

    // 3. 内容目录（Vue3 版本支持更多自定义）
    outline: {
      level: [2, 4],  // 支持 h2-h4 标题（比 1.x 版本更灵活）
      label: {
        '/': '文档目录',
        '/en/': 'Table of Contents',
      },
    },

    // 4. 其他 Vue3 主题特性
    editLink: false,  // 关闭编辑链接（如需开启可配置 repo 地址）
    lastUpdated: true,  // 显示最后更新时间（Vue3 版本性能优化）
    contributors: false,  // 不显示贡献者
  }),

  // ========================= Vue3 特有配置 =========================
  // 配置 Vite 构建工具（VuePress 2.x 基于 Vite，替代 1.x 的 Webpack）
  vite: {
    // Vue3 项目常用配置：解决依赖别名、代理等问题
    resolve: {
      alias: {
        // 给 Vue3 核心库设置别名（方便在组件中引入）
        'vue': 'vue/dist/vue.esm-bundler.js',
      },
    },
    // 开发服务器代理（对接后端 API，解决跨域）
    server: {
      proxy: {
        '/api': {
          target: 'http://localhost:8081',  // 后端 Gin 服务地址
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/api/, ''),
        },
      },
    },
  },
};
